import { createRouter, createWebHashHistory } from "vue-router";
// let isLogin = true; //模拟登录状态
import store from "@/store"; //此处的store，等同于this.$store

export const routes = [
  {
    path: "/",
    component: () => import("../layout/index.vue"),
    children: [
      {
        path: "/banner",
        label: "123",
        component: () => import("@/views/banner/index.vue"),
        meta: {
          label: "轮播管理",
          icon: "Picture",
        },
        children: [
          {
            path: "/banner/pub",
            component: () => import("../views/banner/pub.vue"),
            meta: {
              label: "轮播发布",
            },
          },
          {
            path: "/banner/list",
            component: () => import("../views/banner/list.vue"),
            meta: {
              label: "轮播列表",
            },
          },
          {
            path: "/banner/edit",
            component: () => import("../views/banner/edit.vue"),
            meta: {
              label: "轮播编辑",
              hidden: true,
            },
          },
        ],
      },
      {
        path: "/product",
        component: () => import("@/views/product/index.vue"),
        meta: {
          label: "商品管理",
          icon: "Present",
        },
        children: [
          {
            path: "/product/pub",
            component: () => import("../views/product/pub.vue"),
            meta: {
              label: "发布商品",
            },
          },
          {
            path: "/product/list",
            component: () => import("../views/product/list.vue"),
            meta: {
              label: "商品列表",
            },
          },
        ],
      },
      {
        path: "/manager",
        component: () => import("@/views/manager/index.vue"),
        meta: {
          label: "系统设置",
          icon: "Setting",
        },
        children: [
          {
            path: "/manager/role",
            component: () => import("@/views/manager/role.vue"),
            meta: {
              label: "角色管理(简易版)",
            },
          },
          {
            path: "/manager/role1",
            component: () => import("@/views/manager/role1.vue"),
            meta: {
              label: "角色管理(完整版)",
            },
          },
          {
            path: "/manager/user",
            component: () => import("@/views/manager/user.vue"),
            meta: {
              label: "用户管理",
            },
          },
        ],
      },
      {
        path: "/test/guard/:id",
        component: () => import("../views/TestGuard.vue"),
        meta: {
          label: "组件内守卫",
        },
      },
      {
        path: "/chart",
        component: () => import("@/views/chart/index.vue"),
        meta: {
          label: "Echarts图表",
          icon: "PieChart",
        },
      },
      {
        path: "/map",
        component: () => import("@/views/map/index.vue"),
        meta: {
          label: "高德地图",
          icon: "MapLocation",
        },
      },
      {
        path: "/editor",
        component: () => import("@/views/editor/index.vue"),
        meta: {
          label: "富文本编辑器",
          icon: "MapLocation",
        },
      },
      {
        path: "/excel",
        component: () => import("@/views/excel/index.vue"),
        meta: {
          label: "Excel表格",
          icon: "MapLocation",
        },
        children: [
          {
            path: "/excel/in",
            component: () => import("@/views/excel/in.vue"),
            meta: {
              label: "导入Excel",
            },
          },
          {
            path: "/excel/out",
            component: () => import("@/views/excel/out.vue"),
            meta: {
              label: "导出Excel",
            },
          },
        ],
      },
      {
        path: "/test/vuex",
        component: () => import("../views/test-vuex/index.vue"),
        meta: {
          label: "状态机",
        },
      },
      {
        path: "/nopermission",
        component: () => import("../views/nopermission.vue"),
        meta: {
          label: "没有权限",
          hidden: true,
        },
      },
    ],
  },
  {
    path: "/login",
    component: () => import("../views/login/index.vue"),
  },
];
const router = createRouter({
  history: createWebHashHistory(),
  routes,
});

// 全局前置守卫
router.beforeEach((to, from, next) => {
  // console.log("当前用户的路由白名单", store.state.user.userInfo);
  store.commit("bread/initRoutePathMut", to.path);
  let { userInfo } = store.state.user;
  let checkedKeys = userInfo ? userInfo.roleInfo.checkedKeys : []; //提取当前用户的路由权限
  let whiteList = [
    "/",
    "/banner/edit",
    "/chart",
    "/map",
    "/editor",
    "/excel/in",
    "/excel/out",
  ]; //手动定义的白名单
  whiteList = whiteList.concat(checkedKeys); //完整白名单
  // console.log(to, from);
  let routeArr = ["/login", "/nopermission"]; //需要直接放行的路由
  if (!routeArr.includes(to.path)) {
    if (userInfo) {
      if (whiteList.includes(to.path)) {
        next();
      } else {
        next("/nopermission");
      }
    } else {
      next("/login"); //未登录
    }
  } else {
    next(); //登录页面直接放行
  }
});
export default router;
